<template>
    <div class="allocationPeople">
        <van-nav-bar
                title="分配负责人"
                left-text="返回"
                left-arrow
                border
                fixed
                @click-left="$router.go(-1)"
        />
        <div style="height:50px"></div>
        <checkboxGroup :selectType="0" :labelText="'选择业务专员'" :nameVal="salesmanName" :dataSource="salesmanSource" :dataVal="salesmanValArr" @selectResult="selectResult" v-if="LoadComplete" />
        <checkboxGroup :selectType="1" :labelText="'选择客服专员'" :nameVal="customerName" :dataSource="customerSource" :dataVal="customerValArr" @selectResult="selectResult" v-if="LoadComplete" />
        <checkboxGroup :selectType="2" :labelText="'选择财务专员'" :nameVal="financeName" :dataSource="financeSource" :dataVal="financeValArr" @selectResult="selectResult" v-if="LoadComplete" />
        <checkboxGroup :selectType="3" :labelText="'选择工伤专员'" :nameVal="compensateName" :dataSource="compensateSource" :dataVal="compensateValArr" @selectResult="selectResult" v-if="LoadComplete" />
        <div @click="pushInfo" class="line-btn" style="margin-top: 10px;" v-if="LoadComplete">保存</div>
    </div>
</template>

<script>
import checkboxGroup from '@/components/checkboxGroup.vue'
// import headerItem from '@/components/header.vue'

export default {
    name: "rlAllocationPeople",
    components: {
        checkboxGroup, checkboxGroup
    },
    data() {
        return {
            LoadComplete: false,

            salesmanName: '',
            salesmanValArr: [],
            salesmanSource: [],

            customerName: '',
            customerValArr: [],
            customerSource: [],

            financeName: '',
            financeValArr: [],
            financeSource: [],

            compensateName: '',
            compensateValArr: [],
            compensateSource: [],
        }
    },
    methods: {
        selectResult(type, title, Arr, val3) {
            if (type == 0) {
                this.salesmanName = title
                this.salesmanValArr = Arr
            }
            if (type == 1) {
                this.customerName = title
                this.customerValArr = Arr
            }
            if (type == 2) {
                this.financeName = title
                this.financeValArr = Arr
            }
            if (type == 3) {
                this.compensateName = title
                this.compensateValArr = Arr
            }
        },
        // 客服类型
        onKefu(value, index) {
            this.salesmanIndex = index;
            this.salesmanName = value.name
            this.salesmanPickerShow = false;
        },
        getConfig() {
            let params = {
                wx_member_id: localStorage.getItem('wx_member_id'),
                token: localStorage.getItem('token'),
            };
            this.$post("/api/member/distribution", params)
                .then(res => {
                    if (res.code == 1) {
                        this.salesmanSource = res.data.salesman // 业务专员
                        this.customerSource = res.data.customer // 客服专员
                        this.financeSource = res.data.finance // 财务专员
                        this.compensateSource = res.data.compensate // 工伤专员

                        // 筛选 业务专员选中的选项
                        let salesmanValArr = []
                        let salesmanNameArr = []
                        res.data.salesman.map((item, index) => {
                            if (item.selected) {
                                salesmanValArr.push(item.value)
                                salesmanNameArr.push(item.name)
                            }
                        })
                        this.salesmanValArr = salesmanValArr
                        this.salesmanName = salesmanNameArr.toString(',')
                        // 筛选 客服专员选中的选项
                        let customerValArr = []
                        let customerNameArr = []
                        res.data.customer.map((item, index) => {
                            if (item.selected) {
                                customerValArr.push(item.value)
                                customerNameArr.push(item.name)
                            }
                        })
                        this.customerValArr = customerValArr
                        this.customerName = customerNameArr.toString(',')
                        // 筛选 财务专员选中的选项
                        let financeValArr = []
                        let financeNameArr = []
                        res.data.finance.map((item, index) => {
                            if (item.selected) {
                                financeValArr.push(item.value)
                                financeNameArr.push(item.name)
                            }
                        })
                        this.financeValArr = financeValArr
                        this.financeName = financeNameArr.toString(',')
                        // 筛选 工伤专员选中的选项
                        let compensateValArr = []
                        let compensateNameArr = []
                        res.data.compensate.map((item, index) => {
                            if (item.selected) {
                                compensateValArr.push(item.value)
                                compensateNameArr.push(item.name)
                            }
                        })
                        this.compensateValArr = compensateValArr
                        this.compensateName = compensateNameArr.toString(',')


                        this.LoadComplete = true
                        this.$Toast.clear();
                    }
                })
                .catch(err => { });
        },
        onPopupClickRight(type) {
            if (type == 0) {
                let nameArr = []
                this.salesmanSource.map((item, index) => {
                    if (this.salesmanValArr.includes(item.value)) {
                        nameArr.push(item.name);
                    }
                })
                this.salesmanName = nameArr.toString(',')
                this.salesmanPickerShow = false
            }
            if (type == 1) {
                let nameArr = []
                this.customerSource.map((item, index) => {
                    if (this.customerValArr.includes(item.value)) {
                        nameArr.push(item.name);
                    }
                })
                this.customerName = nameArr.toString(',')
                this.customerPickerShow = false
            }
        },
        pushInfo() {
            let params = {
                wx_member_id: localStorage.getItem('wx_member_id'),
                token: localStorage.getItem('token'),
                salesman_id: this.salesmanValArr.toString(','),
                customer_id: this.customerValArr.toString(','),
                finance_id: this.financeValArr.toString(','),
                compensate_id: this.compensateValArr.toString(','),
            };
            this.$post("/api/member/save_distribution", params)
                .then(res => {
                    if (res.code == 1) {
                        this.$Toast(res.msg);
                        setTimeout(() => {
                            this.$router.go(-1)
                        }, 1500);
                    } else {
                        this.$Toast(res.msg);
                    }
                })
                .catch(err => { });
        }
    },
    created() {
        this.$Toast.loading({
            duration: 0, // 持续展示 toast
            message: '加载中...',
            forbidClick: true
        });
        this.getConfig();
    },
}
</script>

<style lang="less" scoped>
.allocationPeople {
    height: 100vh;
    background: #f8f8f8;
}
</style>